<template>
  <div id="app">
 <van-nav-bar
  :title="this.$store.state.Title"
  :left-text="this.$store.state.return"
  right-text="按钮"
  :left-arrow="this.$store.state.LeftArrow"
  @click-left="toBack()"
  @click-right="onClickRight"
/>
    <router-view class="router"/>
<van-tabbar class="tabbar" v-show="this.$store.state.MenuShow" v-model="active" active-color="red">
  <van-tabbar-item name="home" icon="home-o" @click="ToPath(home)">首页</van-tabbar-item>
  <van-tabbar-item name="cart" icon="cart-o" @click="ToPath(cart)">购物车</van-tabbar-item>
  <van-tabbar-item name="flower" icon="flower-o" @click="ToPath(flower)">互动</van-tabbar-item>
  <van-tabbar-item name="friends" icon="friends-o" @click="ToPath(friends)">我的</van-tabbar-item>
</van-tabbar>

  </div>
</template>
    
<script>

export default {
data(){
  return {

home:"/",
cart:"/cart/",
flower:"/flower",
friends:"/mine",
active:'home'

  }
},
 components:{
    //  Menu,
 
  
    
  },
 
     mounted() {
 
  },
    created: function() {
    // 在实例创建完成后被立即调用。在这一步，实例已完成以下的配置：数据观测 (data observer)，属性和方法的运算，watch/event 事件回调。然而，挂载阶段还没开始，$el 属性目前尚不可用。

        this.start()
   
  },
  
   methods: {
         // 滚动到页面顶部
  

    // 后退
   toBack() {
        console.log('点击了返回')
        this.$router.go(-1);
        
      },
    //   reload(){
		// 	this.isRouterAlive = false;
		// 	this.$nextTick(function () {
		// 		this.isRouterAlive = true
		// 	});
		// },
    onClickRight() {
      this.Toast('按钮');
    },
       // 在挂载开始之前被调用：相关的 render 函数首次被调用。
    ToPath(Puth){
      this.$router.push(Puth)
    },
    start(){
      let user = 0 
       localStorage.setItem("user", JSON.stringify(user));
       let userdata = JSON.parse(localStorage.getItem("user"));
     
  
      if(userdata ===0){
        const login = "/login"
         this.$router.push(login)
      }else {
         this.Toast("您还没有登录")
      }

    }

 
    

  }
  
}
</script>



<style lang="scss">
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}


/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

html,
body {
    width: 100%;
    height: 100%;
    overflow: hidden;
    color: #333333;
    /* 不指定font-size为0 图片会有缝隙 */
    font-size: 0;
    /* 不允许去选中文本 */
    user-select: none;
}

html,body{
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}
#app {
  width: 100%;
  height: 100%;
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  display: flex;
  flex-direction: column;
  background-color: yellowgreen;
  .NavBar {
    width: 100%;
    height: 1rem;
    background-color: whitesmoke;
  }
}
.router {
  flex: 1;
}
.tabbar {
  height: 1.1rem;
}
.van-tab__pane {
  height: 100%;
}

</style>

